<template>
	<view>
	<view class="btn">
		<button class="btn1" @click="login" >登录</button>
		<view class="name" >
			<image :src="userInfo.avatarUrl" mode=""  class="imgs1"></image>
			<view >{{userInfo.nickName}}</view>
		</view>
		<button @click="remo">退出登录</button>
		<view class="list">
			<view>
				<view>5</view>
				<view>健康分</view>
			</view>
			<view>
				<view>5</view>
				<view>优惠券</view>
			</view>
			<view>
				<view>5</view>
				<view>消息</view>
			</view>
		</view>
	</view>
	<view class="center">
		<view class="jz">
			<view>
				<image src="../../static/1/jiuzhen.png" mode="" style="width: 30px; height: 30px;"></image>
			</view>
			<navigator url="/pages/run/run">就诊人管理</navigator>
		</view>
		<view class="jz">
			<view>
				<image src="../../static/1/guahao.png" mode="" style="width: 30px; height: 30px;"></image>
			</view>
			<view>我的挂号</view>
		</view>
		
		<view class="jz">
			<view>
				<image src="../../static/1/xinguanyimiao.png" mode="" style="width: 30px; height: 30px;"></image>
			</view>
			<view>新冠疫苗</view>
		</view>
		<view class="jz">
			<view>
				<image src="../../static/1/hpv.png" mode="" style="width: 30px; height: 30px;"></image>
			</view>
			<view>HPV疫苗</view>
		</view>
		
		<view class="jz">
			<view >
				<image src="../../static/1/hesuanjiance.png" mode="" style="width: 30px; height: 30px;"></image>
			</view>
			<view>核酸检测</view>
		</view>
		<view class="jz">
			<view>
				<image src="../../static/1/wodetijian.png" mode="" style="width: 30px; height: 30px;"></image>
			</view>
			<view>我的体检</view>
		</view>
	</view>
	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:''
			}
		},
		methods: {
			login(){
				uni.navigateTo({
					url:"/pages/login/login"
				})
			},
			// 退出登录
			remo(){
				uni.removeStorageSync("logins")
				uni.removeStorageSync("token")
				uni.navigateTo({
					url:"/pages/login/login"
				})
			}
		},
		onShow() {
			this.userInfo=uni.getStorageSync("logins")|[]
		}
	}
</script>

<style lang="scss" scoped>
.btn{
	width: 100%;
	background: #e3efff;
}
.btn1{
	margin: 10px auto 20px;
	width: 100px;
	height: 50px;
}
.list{
	text-align: center;
	display: flex;
	justify-content: space-around;
}
.name{
	width: 100%;
	height: 200px;
}
.imgs1{
	// width: 200px;
	height: 180px;
	margin: auto;
}
.center{
	background: #fff;
	border-radius: 10px;
	width: 100%;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	padding: 10px ;
	text-align: center;
}
.jz{
	width: 25%;
}
</style>
